<template>
    <div class="advert container">
        <a :href="'/product/' + item.id" v-for="(item,index) in adsList" :key="index">
<!--            <img :src="item.img" alt="">-->
            <img v-lazy="item.img" alt="">
        </a>
    </div>
</template>

<script>
    export default {
        name: "Advert",
        data() {
            return {
                adsList: [
                    {id: 33, img: require('assets/images/ads/ads-1.png')},
                    {id: 48, img: require('assets/images/ads/ads-2.jpg')},
                    {id: 45, img: require('assets/images/ads/ads-3.png')},
                    {id: 47, img: require('assets/images/ads/ads-4.jpg')},
                ]
            }
        }
    }
</script>

<style scoped lang="scss">
    .advert {
        display: flex;
        justify-content: space-between;
        align-items: center;
        a {
            /*display: inline-block;*/
            /*width: 296px;*/
            height: 167px;
            padding: 14px 0 31px 0;
        }
    }
</style>
